<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <title>小兔鲜儿 - 新鲜 惠民 快捷!</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="renderer" content="webkit">
    <!-- <link rel="stylesheet" href="//at.alicdn.com/t/font_1939705_bgtmkonu28.css"> -->
    <link rel="stylesheet" href="./css/common.css">
    <link rel="stylesheet" href="./css/product.css">
    <link rel="stylesheet" href="./css/infomation.css">
  </head>
  
  <body>
    <!-- 项部导航 -->
    <div class="xtx_topnav">
      <div class="wrapper">
        <!-- 顶部导航 --> 
        <ul class="xtx_navs">
          <li>
            <a href="login/login.html">请先登录</a>
          </li>
          <li>
            <a href="javascript:;">免费注册</a>
          </li>
          <li>
            <a href=".javascript:;">我的订单</a>
          </li>
          <li>
            <a href="javascript:;">会员中心</a>
          </li>
          <li>
            <a href="javascript:;">帮助中心</a>
          </li>
          <li>
            <a href="javascript:;">在线客服</a>
          </li>
          <li>
            <a href="javascript:;">
              <i class="mobile sprites"></i>
              手机版
            </a>
          </li>
        </ul>
      </div>
    </div>
    <!-- 头部 -->
    <div class="xtx_header">
      <div class="wrapper">
        <!-- 网站Logo -->
        <h1 class="xtx_logo"><a href="/">小兔鲜儿</a></h1>
        <!-- 主导航 -->
        <div class="xtx_navs">
          <ul class="clearfix">
            <li>
              <a href="javascript:;">首页</a>
            </li>
            <li>
              <a href="javascript:;">生鲜</a>
            </li>
            <li>
              <a href="javascript:;">美食</a>
            </li>
            <li>
              <a href="javascript:;">餐厨</a>
            </li>
            <li>
              <a href="javascript:;">电器</a>
            </li>
            <li>
              <a href="javascript:;">居家</a>
            </li>
            <li>
              <a href="javascript:;">洗护</a>
            </li>
            <li>
              <a href="javascript:;">孕婴</a>
            </li>
            <li>
              <a href="javascript:;">服装</a>
            </li>
          </ul>
        </div>
        <!-- 站内搜索 -->
        <div class="xtx_search clearfix">
          <!-- 购物车 -->
          <a href="" class="xtx_search_cart sprites">
            <i>2</i>
          </a>
          <!-- 搜索框 -->
          <div class="xtx_search_wrapper">
            <input type="text" placeholder="搜一搜" onclick="location.href='./search.html'">
          </div>
        </div>
      </div>
    </div> 
    <!-- 滚动之后出现的头部 -->
    <div class="xtx_header header_fixed">
      <div class="wrapper">
        <!-- 网站Logo -->
        <h1 class="xtx_logo"><a href="/">小兔鲜儿</a></h1>
        <!-- 主导航 -->
        <div class="xtx_navs">
          <ul class="clearfix">
            <li>
              <a href="javascript:;">首页</a>
            </li>
            <li>
              <a href="javascript:;">生鲜</a>
            </li>
            <li>
              <a href="javascript:;">美食</a>
            </li>
            <li>
              <a href="javascript:;">餐厨</a>
            </li>
            <li>
              <a href="javascript:;">电器</a>
            </li>
            <li>
              <a href="javascript:;">居家</a>
            </li>
            <li>
              <a href="javascript:;">洗护</a>
            </li>
            <li>
              <a href="javascript:;">孕婴</a>
            </li>
            <li>
              <a href="javascript:;">服装</a>
            </li>
          </ul>
        </div>
        <!-- 站内搜索 -->
        <div class="xtx_search clearfix">
          <!-- 购物车 -->
          <a href="" class="xtx_search_cart sprites">
            <i>2</i>
          </a>
          <!-- 搜索框 -->
          <div class="xtx_search_wrapper">
            <input type="text" placeholder="搜一搜" onclick="location.href='./search.html'">
          </div>
        </div>
      </div>
    </div>

        <!-- 商品信息 -->
        <div class="xtx-product-info">
          <div class="left">
            <div class="pictrue">
              <div class="middle">
                <img src="	https://yanxuan-item.nosdn.127.net/841d7669e6cc23cb249f47d8d39fc17c.jpg
                " alt="">
                <div class="layer"></div>
              </div>
              <div class="small">
                <ul>
                  <li class="active"><img src="	https://yanxuan-item.nosdn.127.net/841d7669e6cc23cb249f47d8d39fc17c.jpg" alt=""></li>
                  <li><img src="https://yanxuan-item.nosdn.127.net/76677526bc2f80950920887c4a56bca5.jpg
                    " alt=""></li>
                  <li><img src="	https://yanxuan-item.nosdn.127.net/6780ed92283e7e7ad585df5bc9664265.jpg
                    " alt=""></li>
                  <li><img src="	https://yanxuan-item.nosdn.127.net/537adcdc8a4196950f1e68686c57a484.jpg" alt=""></li>
                  <li><img src="	https://yanxuan-item.nosdn.127.net/36a6e6ec81dc0ed08e2a2482bb172d65.jpg" alt=""></li>
                </ul>
              </div>
              <div class="large" style="background-image: url(./images//1.jpg);"></div>
            </div>
            <div class="other">
              <ul>
                <li>
                  <p>销量人气</p>
                  <p>1999+</p>
                  <p>销量人气</p>
                </li>
                <li>
                  <p>商品评价</p>
                  <p>999+</p>
                  <p>查看评价</p>
                </li>
                <li>
                  <p>收藏人气</p>
                  <p>299+</p>
                  <p><a href="javascript:;">收藏商品</a></p>
                </li>
                <li>
                  <p>品牌信息</p>
                  <p>小包</p>
                  <p><a href="javascript:;">品牌主页</a></p>
                </li>
              </ul>
            </div>
          </div>
          <div class="right">
            <h3 class="name">新款LOGO印花时尚学步叫叫鞋</h3>
            <p class="desc">软底包头叫叫鞋</p>
            <p class="price"><span class="now">¥259</span><span class="old">¥279</span></p>
            <div class="address">
              <div class="item">
                <div class="dt">促销</div>
                <div class="dd">12月好物放送，App领券购买直降120元</div>
              </div>
              <div class="item">
                <div class="dt">配送</div>
                <div class="dd">至
                  <div class="box">
                    <span>陕西 西安 <i></i></span>
                  </div>
                </div>
              </div>
              <div class="item">
                <div class="dt">服务</div>
                <div class="dd">
                  <span class="fw">无忧退货</span>
                  <span class="fw">快速退款</span>
                  <span class="fw">免费包邮</span>
                  <a href="#" class="lj">了解详情</a>
                </div>
              </div>
            </div>
            <div class="attrs">
              <div class="item">
                <div class="dt">颜色</div>
                <div class="dd">
                  <img src="	https://yanxuan-item.nosdn.127.net/fc5ea7c90efe6f16511f481713735308.jpg" alt="">
                  <img src="	https://yanxuan-item.nosdn.127.net/749c58c841863349154382fc293bfd96.jpg" alt="">
                  
                </div>
              </div>
             
              <div class="item">
                <div class="dt">数量</div>
                <div class="dd">
                  <div class="num">
                    <input type="text" id="total" value="1" readonly>
                    <input type="button" value="+" id="add">
                    <input type="button" value="-" id="reduce" disabled>
                  </div>
                </div>
              </div>
              <div class="item">
                <a class="buy" href="">立即购买</a> 
              </div>
            </div>
          </div>
        </div>
       
    <!-- 公共底部 -->
    <div class="xtx_footer clearfix">
      <div class="wrapper">
        <!-- 联系我们 -->
        <div class="contact clearfix">
          <dl>
            <dt>客户服务</dt>
            <dd class="chat">在线客服</dd>
            <dd class="feedback">问题反馈</dd>
          </dl>
          <dl>
            <dt>关注我们</dt>
            <dd class="weixin">公众号</dd>
            <dd class="weibo">微博</dd>
          </dl>
          <dl>
            <dt>下载APP</dt>
            <dd class="qrcode">
              <img src="./uploads/qrcode.jpg">
            </dd>
            <dd class="download">
              <span>扫描二维码</span>
              <span>立马下载APP</span>
              <a href="javascript:;">下载页面</a>
            </dd>
          </dl>
          <dl>
            <dt>服务热线</dt>
            <dd class="hotline">
              400-0000-000
              <small>周一至周日 8:00-18:00</small>
            </dd>
          </dl>
        </div>
      </div>
      <!-- 其它 -->
      <div class="extra">
        <div class="wrapper">
          <!-- 口号 -->
          <div class="slogan">
            <a href="javascript:;" class="price">价格亲民</a>
            <a href="javascript:;" class="express">物流快捷</a>
            <a href="javascript:;" class="quality">品质新鲜</a>
          </div>
          <!-- 版权信息 -->
          <div class="copyright">
            <p>
              <a href="javascript:;">关于我们</a>
              <a href="javascript:;">帮助中心</a>
              <a href="javascript:;">售后服务</a>
              <a href="javascript:;">配送与验收</a>
              <a href="javascript:;">商务合作</a>
              <a href="javascript:;">搜索推荐</a>
              <a href="javascript:;">友情链接</a>
            </p>
            <p>CopyRight &copy; 小兔鲜儿</p>
          </div>
        </div>
      </div>
  
      <div class="xtx-elevator" style="opacity: 1;">
        <li>
          <a href="javascript:;" id="backTop">
            <i class="sprites"></i>
            顶部
          </a>
        </li>
      </div>
    </div>
  <script src="./js/info.js"></script>
  </body>
</html>